$(document).ready(function () {
            $.ajax({
                url: 'http://127.0.0.1:5000/movies/rating',
                type: 'get',
                success: function (res) {
                    // 不再显示"数据获取成功"
                    $("#getResult").hide();
                    // 适配后端返回的 { average_rating, movies } 结构
                    let list = [];
                    if (Array.isArray(res.movies)) {
                        list = res.movies;
                    }
                    // 只显示前20部电影，避免标签过多
                    list = list.slice(5, 15);
                    if (!list.length) {
                        $("#getResult").text('没有可用的电影评分数据！').show();
                        return;
                    }
                    if (!('movie_name' in list[0]) || !('rating' in list[0])) {
                        $("#getResult").text('数据格式不正确，需包含movie_name和rating字段！').show();
                        console.log('实际数据：', list[0]);
                        return;
                    }
                    // 准备图表数据
                    const labels = list.map(item => item.movie_name);
                    const data = list.map(item => item.rating);
                    // 创建图表
                    const ctx = document.getElementById('pingfen').getContext('2d');
                    new Chart(ctx, {
                        type: 'bar',
                        data: {
                            labels: labels,
                            datasets: [{
                                label: '电影评分',
                                data: data,
                                backgroundColor: 'rgba(255, 99, 132, 0.5)',
                                borderColor: 'rgba(255, 99, 132, 1)',
                                borderWidth: 1
                            }]
                        },
                        options: {
                            responsive: true,
                            plugins: {
                                legend: {
                                    display: false
                                },
                                title: {
                                    display: false
                                },
                                tooltip: {
                                    callbacks: {
                                        title: function (context) {
                                            let name = context[0].label;
                                            return name.length > 20 ? name.slice(0, 20) + '...' : name;
                                        }
                                    }
                                }
                            },
                            scales: {
                                y: {
                                    min: 8,
                                    max: 10,
                                    title: {
                                        display: true,
                                        text: '评分',
                                        color: '#fff',
                                        position: 'top',  
                                    },
                                    ticks: {
                                        color: '#ffffff',
                                        fontWeight: '300',
                                        stepSize: 0.4,
                                        callback: function(value) {
                                            return value.toFixed(1);
                                        },
                                        autoSkip: false
                                    }
                                },
                                x: {
                                    title: {
                                        display: true,
                                        // text: '电影名称',
                                        color: '#ccc',
                                        align: 'end' // X轴标题靠右对齐
                                    },
                                    ticks: {
                                        callback: function (value, index, values) {
                                            let label = this.getLabelForValue(value);
                                            return label.length > 6 ? label.slice(0, 6) + '…' : label;
                                        },
                                        autoSkip: false,
                                        maxRotation: 40,
                                        minRotation: 15,
                                        color: '#ffffff',
                                    }
                                }
                            }
                        }
                    });
                },
                error: function (xhr, status, error) {
                    $("#getResult").text("请求失败：" + error).show();
                }
            });
        });